<template>
  <div class="nowSaleStatus">
    <x-header class="header" :left-options="{showBack: showHeaderBack}" ref="header">
      当前场内销售状况
      <a v-if="loadingStatus" slot="right" >刷新中...</a>
      <a v-else slot="right" @click="refreshPage(true)" >刷新页面</a>
    </x-header>
    <div class="topHolder"></div>
    <group title="详情列表：">
      <x-table :cell-bordered="false">
        <thead>
        <tr style="background-color: #F7F7F7">
          <th width="34%"></th>
          <th width="33%">销售数量</th>
          <th width="33%">赠送数量</th>
        </tr>
        </thead>
        <tbody>
        <tr v-for="(item,index) in saleStatusList" :key="index">
          <td v-text="item.typeName"></td>
          <td v-text="item.sale"></td>
          <td v-text="item.gift"></td>
        </tr>
        <tr v-if="saleStatusList.length <= 0">
          <td colspan="3">
            <div class="listNoItem">暂无场内销售数据</div>
          </td>
        </tr>
        <tr>
          <td>全部分类</td>
          <td v-text="sales"></td>
          <td v-text="gifts"></td>
        </tr>
        </tbody>
      </x-table>
    </group>
    <br/>
  </div>
</template>

<script>
  import {getNowSaleStatus} from "../../api";
  import {Box, XButton, Group, XTable } from 'vux'
  import {message} from "../../common/util";

  export default {
    name:'nowSaleStatus',
    data(){
      return{
        showHeaderBack:this.GLOBAL.showHeaderBack,
        loadingStatus:false,
        saleStatusList:[],
        sales:0,
        gifts:0
      }
    },
    components:{
      Box,
      XButton,
      Group,
      XTable
    },
    computed:{
      authority(){
        return this.$store.getters.getAuthority
      }
    },
    methods:{
      refreshPage(mess){
        this.loadingStatus = true
        this.sales=0
        this.gifts=0
        getNowSaleStatus().then((res)=>{
          if(res.status == 'success'){
            this.saleStatusList = res.data
            for(let item of this.saleStatusList){
              this.sales += item.sale
              this.gifts += item.gift
            }
            if(mess)message({message:'刷新页面成功',type:'info'})
          }else if(res.status == 'error') {
            message({message:res.msg,type:'error'})
            console.log('getNowSaleStatus error info:', res.msg)
          }
          this.loadingStatus = false
        }).catch((err)=>{console.log('getNowSaleStatus catch info:',err)})
        this.$store.commit('updateLoadingStatus',{isLoading:false})
        //this.$router.go(0)
      }
    },
    mounted(){
      this.refreshPage()
    }
  }
</script>

<style lang="scss" scoped>
  .nowSaleStatus{
  }
</style>
